<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>v-bind</title>
        <script src="js/vuejs-2.5.16.js"></script>
    </head>
    <body>
        <div id="app">
            <font size="5" v-bind:color="ys1">船只</font>
            <font size="5" :color="ys2">黑马</font>
        </div>
    </body>
    <script>
        //view model
        //插值表达式不能用于html标签的属性取值
        //要想给html标签的属性设置变量的值，需要使用v-bind
        //v-bind也可以简化写法  直接使用：
        new Vue({
            el:"#app",
            data:{
                ys1:"red",
                ys2:"green"
            }

        });


        //传统js


    </script>
</html>